$(document).ready(function(){

// prdNavi Show
$.fn.draggable = function() {
var offsetA = null;
var offsetB = null;
var start = function(e) {
	var orig = e.originalEvent;
	var posWrap = $("#wrap").position();
	var posNavi = $("#prdNavi").position();
	offsetA = {
		x: orig.changedTouches[0].pageX - posWrap.left
	  };
};


var moveMe = function(e) {
	e.preventDefault();
	var orig = e.originalEvent;
	var distance = orig.changedTouches[0].pageX - offsetA.x;

	if(distance < 150 && distance > -350 ){
		document.getElementById("wrap").style.webkitTransform = 'translate3d(' + distance + 'px,0,0)';
		document.getElementById("prdNavi").style.webkitTransform = 'translate3d(' + distance + 'px,0,0)';
	}

};

var moveEnd = function(e) {
	e.preventDefault();
	var orig = e.originalEvent;
	var distance = orig.changedTouches[0].pageX ;
	var range = orig.changedTouches[0].pageX - offsetA.x;
	var objW = $(this).width();
	var r = 0;

	if(range < 0) {  // gesture Left
		if(distance < -(range)) {
			moveOn();
		} else {
			moveOff();
		}
	} else if(range > 0) {  // gesture Right
		if (distance > 20){
			moveOff();
		}
	}
}


this.bind("touchstart", start);
this.bind("touchmove", moveMe);
this.bind("touchend", moveEnd);
};
/////

//var bbFuc = true; // bind 
//var naviChk = true; // prdClick

$(function(){
	$($("#header").siblings()).on('touchstart', function(){
		$("#wrap").unbind('touchstart').unbind("touchmove").unbind("touchend");
	});
	$("#header").on('touchstart', function(){
		$("#wrap").draggable();
	});
});

// 메인 GNB 제품 클릭시
$("#showPrdNavi, #osullocNavi").click(function(){
	var naviChk2 = $(this).hasClass("on"); //
	var menuChk = $(this).attr("id");	

	moveOn();

	if(menuChk == "osullocNavi"){
		$("#prdMenuWrap").hide();
		$("#osullocMenuWrap").show();
	} else {
		$("#prdMenuWrap").show();
		$("#osullocMenuWrap").hide();
	}
	 return false;
});

// prdShow
$("#prdCate").click(function(){
	$("#showPrdNavi").trigger("click")
	return false;
});

// docLoad END
});



var mobileKeyWords = new Array('Android');
var resizeTimeout;

$(window).resize(function(){
	// Android 리사이징속도 느림..
	for (var word in mobileKeyWords){
		if (navigator.userAgent.match(mobileKeyWords[word]) != null){
			clearTimeout(resizeTimeout);
			resizeTimeout = setTimeout(resizeEvent, 100);
		} else {
			clearTimeout(resizeTimeout);
			resizeTimeout = setTimeout(resizeEvent, 100);
		}
	}
});



function resizeEvent(){
	var layoutH = $("#wrap").width();

	$("#prdNavi").css({"margin-left" : layoutH , "height" : $("#wrap").height()});
}



$(window).on("load", function(){
	// 비주얼 버튼 동적 생성
	$("#visual li").each(function (e) {
		$("#visualWarp .navLength").append('<button type="button" onclick="moveVisual(' + e + ');">page' + (e+1) + '</button>');
	});	
	$("#visualWarp .navLength button:first-child").addClass("activeSlide"); //비주얼 버튼 첫번째 활성화
	// 오설록 베스트 상품
	$("#prdSlider li").each(function (e) {
		$("#prdBest .navLength").append('<button type="button" onclick="movePrd(' + e + ');">page' + (e+1) + '</button>');
	});	
	$("#prdBest .navLength button:first-child").addClass("activeSlide"); 

	$("#prdNavi").css({"margin-left" : $("#wrap").width(), "display" : "block" , "height" : $("#wrap").height()});
});




// prdNavi Visible
function moveOn(){
	document.getElementById("wrap").style.webkitTransform = 'translate3d(-261px,0,0)';
	document.getElementById("prdNavi").style.webkitTransform = 'translate3d(-261px,0,0)';
	$("#wrapper").addClass("wrapperHide")

}

// prdNavi hidden
function moveOff(){
	document.getElementById("wrap").style.webkitTransform = 'translate3d(0,0,0)';
	document.getElementById("prdNavi").style.webkitTransform = 'translate3d(0,0,0)';
	$("#wrapper").removeClass("wrapperHide")
}


// prdouct Navi - prev
function prevPage(){
	history.back(-1);
}



function showLayer(e){
	var objPos = $("a[name='"+ e +"']").position().top;
	var position = $("a[name='"+ e +"']").height() + objPos + 20;

	$("#layerBg").css("height", document.body.scrollHeight).show();
	$("#" + e).show().css({'top': position}); // 팝업의 position 지정
	$("body, html").animate({scrollTop:objPos}); // 팝업위치로 스크롤 이동
}

function hideLayer(e){
	$("#" + e).hide();
	$("#layerBg").hide();
}